<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
        .div1 {
            height: 180px;
            width: 380px;
            border: 1px solid #8a8989;
            margin: 0 auto;
        }
        .input {
            display: block;
            width: 350px;
            height: 40px;
            margin: 10px auto;
        }
        .button {
            background: #2066c5;
            color: white;
            font-size: 18px;
            height: 50px;
            border-radius: 4px;
        }
    </style>
</head>
<body>
<div class="div1">
    <form action="login" method="post">
        {{ form.csrf_token }}
        <input type="text" class="input" placeholder="please inter your username">
        <input type="password" class="input" placeholder="please inter your password">
        <input type="submit" value="login" class="input button">
    </form>
</div>
</body>
</html>